<template>
  <el-container>
    <el-header>
      <AdminHeader />
    </el-header>
    <el-container>
      <el-aside>
        <AdminAside />
      </el-aside>
      <el-main style="margin: 0 auto;">
        <el-table :data="newsList" style="width: 100%;font-size: 16px;">
          <el-table-column prop="news_id" label="新闻Id" width="350">
          </el-table-column>

          <el-table-column prop="news_title" label="标题" width="350">
          </el-table-column>

          <el-table-column prop="category_id" label="类别" width="350">
          </el-table-column>


          <el-table-column prop="news_id" width="180" label="操作">
            <template slot-scope="scope">
              <el-button size="mini" type="danger" @click="deleteNews(scope.row.news_id)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-main>

    </el-container>
  </el-container>


</template>

<script>
import AdminAside from '@/components/AdminAside.vue';
import AdminHeader from '@/components/AdminHeader.vue';

export default {
  data() {
    return {
      newsList: [

      ]


    };
  },
  components: {
    AdminAside,
    AdminHeader
  },
  mounted() {
    this.getNewsList()
  },
  methods: {
    getNewsList() {
      this.axios.get('http://localhost:3000/news/getHomeNews').
        then(res => {
          this.newsList = res.data.data


        }).catch(err => {
          console.log(err);
        })
    },
    deleteNews(id) {
      this.axios.delete('http://localhost:3000/aManger/deleteNews', {
        data: {
          id: id
        }
      }).
        then(res => {
          // this.newsList = res.data.data


        }).catch(err => {
          console.log(err);
        })
    }
  }

}
</script>

<style scoped>
.el-header {
  padding: 0;
}

.el-aside {
  color: #000000;
  text-align: center;
  height: 880px;
}
</style>